<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<body>

<%--侧边栏导航--%>
<div class="nav-left">
    <div class="title">
        <p class="title-name">图书管理系统</p>
        <p class="title-identity-user" id="user-title" style="display: none">-用户</p>
        <p class="title-identity-manager" id="manager-title" style="display: none">-管理员</p>
        <p class="title-identity-user" id="visitor-title" style="display: none">-游客</p>
    </div>
<%--    图书首页--%>
    <a href="bookHome" id="bookHome">
        <div class="nav-left-item bookHome" tabindex="1">
            <div class="item-icon">
                <i class="fa fa-thin fa-house"></i>
            </div>
            <label>图书首页</label>
        </div>
    </a>

    <a href="allBook" id="allBook">
        <div class="nav-left-item allBook" tabindex="1">
            <div class="item-icon">
                <i class="fa fa-thin fa-hand"></i>
            </div>
            <label>图书租借</label>
        </div>
    </a>


<%--    我的借阅--%>
    <a href="myBook" id="myBook">
        <div class="nav-left-item myBook" tabindex="1">
            <div class="item-icon">
                <i class="fa fa-thin fa-book"></i>
            </div>
            <label>我的借阅</label>
        </div>
    </a>
<%--    留言板--%>
    <a href="message" id="message">
        <div class="nav-left-item message" tabindex="1">
            <div class="item-icon">
                <i class="fa fa-thin fa-message"></i>
            </div>
            <label>留言板</label>
        </div>
    </a>
<%--    个人账户--%>
    <a href="selfInfo" id="selfInfo">
        <div class="nav-left-item selfInfo" tabindex="1">
            <div class="item-icon">
                <i class="fa fa-thin fa-user"></i>
            </div>
            <label>个人账户</label>
        </div>
    </a>

    <!-- 管理员端扩展功能 -->
    <a href="bookManage" id="bookManage">
        <div class="nav-left-item bookManage" tabindex="1">
            <div class="item-icon">
                <i class="fa fa-thin fa-list-check"></i>
            </div>
            <label>图书管理</label>
        </div>
    </a>

    <a href="userManage" id="userManage">
        <div class="nav-left-item userManage" tabindex="1">
            <div class="item-icon">
                <i class="fa fa-light fa-person"></i>
            </div>
            <label>用户管理</label>
        </div>
    </a>

</div>
<div class="w">

<%--    顶部导航--%>
    <div class="nav-top">
        <div class="nav-top-userinfo">
            <div class="userlogin">
                <i class="fa fa-light fa-book"></i>
                <a href="bookHome" class="link userinfo-link">首页</a>
                <a href="bookHome" class="link userinfo-link" id="exit">退出</a>
            </div>
            <div class="usernotlogin">
                <i class="fa fa-light fa-book"></i>
                <a href="bookHome" class="link userinfo-link">首页</a>
                <a href="login" class="link userinfo-link">登录</a>
                <a href="register" class="link userinfo-link">注册</a>
            </div>
        </div>
        <ul class="nav-top-list">
            <div class="nav-top-list-item">
                <i class="fa fa-light fa-envelope"></i>
                <a href="#" class="link">消息</a>
            </div>
            <div class="nav-top-list-item homepage" id="nav-top-selfInfo-link">
                <a href="selfInfo">
                    <li >欢迎您,</li>
                    <li id="accountName"></li>
                    <li id="visitor">游客</li>
                </a>
            </div>
            <div class="nav-top-list-item">
                <li class="link">关于图书管理系统</li>
            </div>

        </ul>
    </div>
    <script src="js/includePage.js"></script>
<%--    管理员个人账户可以更换身份界面--%>
    <script src="js/selfInfo.js"></script>